{include file="common/meta"}
<body>
<div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a>
          <cite>员工列表</cite></a>
      </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">&#xe669;ဂ</i></a>
</div>
<div class="x-body"  id="admin_index">
    <div class="layui-row">
        <form class="layui-form layui-col-md12 x-so">
            <input class="layui-input" placeholder="开始日" id="workdate3">
            <input class="layui-input" placeholder="截止日" id="quitdate4">
            <input type="text" v-model="username" class="layui-input">
            <button type="button" class="layui-btn" @click="Searchx()"><i class="layui-icon">&#xe615;</i></button>
        </form>
    </div>
    <xblock>
        <!--<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>-->
        <button class="layui-btn" onclick="x_admin_show('添加角色','add',600,400)"><i class="layui-icon"></i>添加员工
        </button>
        <!--<span class="x-right" style="line-height:40px">共有数据：88 条</span>-->
    </xblock>

    <table class="layui-table">
        <thead>
        <tr>
            <!--<th>-->
                <!--<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i-->
                        <!--class="layui-icon">&#xe605;</i></div>-->
            <!--</th>-->
            <th>ID</th>
            <th>账号</th>
            <th>昵称</th>
            <th>民族</th>
            <th>入司时间</th>
            <th>所属组</th>
            <th>性别</th>
            <th>最后登录IP</th>
            <th>操作</th>
        </thead>
        <tbody>
        <template v-if="data_lists.length" v-for="(v,k) in data_lists">
            <tr>
                <!--<td>-->
                    <!--<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i-->
                            <!--class="layui-icon">&#xe605;</i></div>-->
                <!--</td>-->
                <td>{{v.id}}</td>
                <td>{{v.username}}</td>
                <td>{{v.nickname}}</td>
                <td>{{v.minzu}}</td>
                <td>{{v.workdate}}</td>
                <td>{{v.groupid}}</td>
                <td v-if="v.sex == 0">男</td>
                <td v-else>女</td>
                <td>{{v.last_login_ip}}</td>

                <td class="td-manage">
                    <!--<a @click="" href="javascript:;" title="启用">-->

                        <!--<i class="layui-icon">&#xe601;</i>-->
                    <!--</a>-->
                    <a title="编辑" @click="adminEdit(v.id)" href="javascript:;">
                        <!--<i class="layui-icon">&#xe642;</i>-->
                        编辑
                    </a>
                    <a title="删除" @click="adminDelete(v.id)" href="javascript:;">
                        <!--<i class="layui-icon">&#xe640;</i>-->
                        删除
                    </a>
                </td>
            </tr>
        </template>
        <template v-if="data_lists==''">
            <tr>
                <td colspan="11" style="text-align: center;">没有找到匹配的记录</td>
            </tr>
        </template>
        </tbody>
    </table>
    <!--分页-->
    <div class="page" v-if="data_lists.length">
        <div class="message" style="float:left">共<i class="blue"> {{all_list}}</i>条记录，共&nbsp;<i class="blue">
            {{all_page}}</i>&nbsp;页，当前显示第&nbsp;<i class="blue"> {{page}}&nbsp;</i>页
        </div>
        <ul v-if="all_page > 1" style="float:right" class="pagination">
            <li><a v-if="pageList[0] == '...'" @click="pageNext(1)" class="layui-btn layui-btn-primary">首页</a></li>
            <li><a @click="pageNext('prve')" class="syy">上一页</a></li>
            <li v-for="vo in pageList" @click="pageNext(vo)" :class="['syy_list',{'active':vo == page}]"><a>{{vo}}</a>
            </li>
            <li><a @click="pageNext('next')" class="syy"> 下一页 </a></li>
            <li><a v-if="pageList[pageList.length-1] == '...'" @click="pageNext(all_page)" class="syy"> 尾页 </a></li>
        </ul>
    </div>


</div>
<script>
    new Vue({
        el: '#admin_index',
        data: {
            data_lists: [],   //请求的数据
            //-----------分页----------
            page: 1, //当前页
            all_page: 1,//总页数
            all_list: 0,//总数据条数
            //---------搜索条件--------
            username:'',//用户名称
            start_time:'',//开始时间
            end_time:'',//结束时间
            // type:-1, //运行商
            // type_yx:-1, //游戏类型
            // number:'', //局号
            search:0,// 判断是否点击搜索
            // tj:'', //总统计
            // yxjgx:'', //游戏结果
            status:0
        },
        mounted: function () { //初始化调用
                this.getData();
                var _this = this; // 当前的vue对象
                laydate.render({
                    elem: '#workdate3', //指定元素 绑定laydate的元素，即id= laydate的那个input
                    done: function (value) { // value 是laydate选择的日期
                        _this.start_time = value; // vue对象的属性设置为当前的日期
                    },
                });
            laydate.render({
                elem: '#quitdate4', //指定元素 绑定laydate的元素，即id= laydate的那个input
                done: function (value) { // value 是laydate选择的日期
                    _this.end_time = value; // vue对象的属性设置为当前的日期
                },
            });
        },
        watch:{   //
            type:function(){     //type有变化执行
                this.couponListlei();
            }
        },
        computed:{

            //首页 和尾页
            pageList:function(){
                var _this = this;
                if(_this.all_page <= 10){
                    return _this.all_page;
                }else{
                    let bit = [_this.page],rs = _this.page;
                    for(let i=1;i<=5;i++ ){
                        if(parseInt(rs) - parseInt(i) <= 0){
                            bit.push(parseInt(bit[ bit.length-1 ]) + 1);
                        }else{
                            bit.unshift( parseInt(bit[0]) - 1 );
                        }
                    }
                    for( let i=1;i<=4;i++ ){
                        if(parseInt(rs) + parseInt(i) <= _this.all_page){
                            bit.push(parseInt(bit[ bit.length-1 ]) + 1);
                        }else{
                            bit.unshift( parseInt(bit[0]) - 1 );
                        }
                    }
                    if(bit[bit.length - 1] != _this.all_page){
                        bit.push('...');
                    }
                    if(bit[0] != 1){
                        bit.unshift('...');
                    }
                    return bit;
                }
            }
        },
        methods: {
            getData: function () {   //获取数据
                let _this = this;
                layui.use(['form', 'jquery'], function () {
                    $ = layui.jquery;
                    var data_lists = {
                        page: _this.page,
                        username: _this.username,
                        // agent: _this.agent,
                        start_time: _this.start_time,
                        end_time: _this.end_time,
                        // type: _this.type,
                        // type_yx: _this.type_yx,
                        // number: _this.number,
                        search: _this.search,
                        status:_this.status
                    };
                    $.post('{:url("adminData")}',data_lists,function(res){
                        layer.closeAll('loading');//关闭加载动画
                        if(res.data){
                            _this.page = res.data.current_page;
                            _this.all_page = res.data.last_page;
                            _this.all_list = res.data.total;
                            _this.$set(_this, 'data_lists', res.data.data);   //把获取到的数据放入lists里面
                        }
                    });

                });

            },
            /**
             * 下一页上一页
             * @param type
             * @returns {boolean}
             */
            pageNext:function(type){
                if(!type){return false;}
                var _this = this;
                if(!isNaN(type)){
                    _this.page = type;
                }else{
                    if(type == 'prve'){
                        _this.page -= 1;
                    }else if(type == 'next'){
                        _this.page = parseInt(_this.page) + 1;
                    }else{
                        return false;
                    }
                    if(_this.page < 1 ){
                        _this.page = 1;
                        return false;
                    }else if(_this.page > _this.all_page){
                        _this.page = _this.all_page;
                        return false;
                    }
                }
                _this.getData();
            },
            //搜索
            Searchx:function () {
                var _this = this;
                if(_this.username ==''  && _this.start_time=='' && _this.end_time=='')
                {
                    _this.search = 0;
                }else {
                    _this.search = 1;
                }
                _this.page =  1;
                _this.getData();
            },
            adminEdit:function(id){
                x_admin_show('员工编辑','{:url("edit")}?id='+id)
            },
            adminDelete:function (id) {
                $.get('{:url("adminDelete")}',{id:id},function (res) {
                    if(res.code === 1){
                        layer.msg(res.msg,function () {
                            window.location.reload();
                        })
                    }
                })
            },

        }
    });


</script>
</body>

</html>


